<template>
	<view>
		<!-- 顶部 -->
		<view class="items">
			<view class="item">
				<view>推荐</view>
				<view>千里眼</view>
				<view>搞笑</view>
				<view>娱乐</view>
				<view>社会</view>
				<view>音乐</view>
				<view>科技</view>
			</view>
		</view>
		<!-- 视频 -->
		<view class="niu">
			<navigator url="">
				<view class="sha">
					<navigator url="../../videoinfo/new_file">
						6吨公牛被杀，结局令人遗憾
					</navigator>
				</view>
			</navigator>
			<video style="width: 100%;height: 400rpx;"
				src="https://vd3.bdstatic.com/mda-nkd1f6us30rz2h1n/sc/cae_h264/1668392698384936635/mda-nkd1f6us30rz2h1n.mp4?v_from_s=hkapp-haokan-hbe&auth_key=1668492967-0-0-c2050bdfdfecbb35fe3ff1961713ca64&bcevod_channel=searchbox_feed&pd=1&cd=0&pt=3&logid=2767855634&vid=5349982994516799314&abtest=104960_1-104959_2&klogid=2767855634"></video>
			<view class="qa">
				<view class="qw">
					<image style="width: 45rpx;height: 45rpx;margin-top: 20rpx;"
						src="https://img1.baidu.com/it/u=592570905,1313515675&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1668618000&t=02b6f134233fcc0e616ce7711e1f1115"
						mode=""></image>
					<view class="qq">
						琦琦妙妙屋| <span style="color: rebeccapurple;margin-left: 10rpx;">关注</span>
					</view>
				</view>
				<view class="tubiao">
					<icon type="waiting" style="margin-right: 10rpx;"></icon>
					<icon type="success" style="margin-right: 10rpx;"></icon>
					<icon type="search"></icon>
				</view>

			</view>
		</view>
		<view class="niu">
			<navigator url="">
				<view class="sha">
					<navigator url="../../videoinfo/new_file">
						6吨公牛被杀，结局令人遗憾
					</navigator>
				</view>
			</navigator>
			<video style="width: 100%;height: 400rpx;"
				src="https://vd3.bdstatic.com/mda-nkd1f6us30rz2h1n/sc/cae_h264/1668392698384936635/mda-nkd1f6us30rz2h1n.mp4?v_from_s=hkapp-haokan-hbe&auth_key=1668492967-0-0-c2050bdfdfecbb35fe3ff1961713ca64&bcevod_channel=searchbox_feed&pd=1&cd=0&pt=3&logid=2767855634&vid=5349982994516799314&abtest=104960_1-104959_2&klogid=2767855634"></video>
			<view class="qa">
				<view class="qw">
					<image style="width: 45rpx;height: 45rpx;margin-top: 20rpx;"
						src="https://img1.baidu.com/it/u=592570905,1313515675&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1668618000&t=02b6f134233fcc0e616ce7711e1f1115"
						mode=""></image>
					<view class="qq">
						琦琦妙妙屋| <span style="color: rebeccapurple;margin-left: 10rpx;">关注</span>
					</view>
				</view>
				<view class="tubiao">
					<icon type="waiting" style="margin-right: 10rpx;"></icon>
					<icon type="success" style="margin-right: 10rpx;"></icon>
					<icon type="search"></icon>
				</view>

			</view>
		</view>
		<view class="niu">
			<navigator url="">
				<view class="sha">
					<navigator url="../../videoinfo/new_file">
						6吨公牛被杀，结局令人遗憾
					</navigator>
				</view>
			</navigator>
			<video style="width: 100%;height: 400rpx;"
				src="https://vd3.bdstatic.com/mda-nkd1f6us30rz2h1n/sc/cae_h264/1668392698384936635/mda-nkd1f6us30rz2h1n.mp4?v_from_s=hkapp-haokan-hbe&auth_key=1668492967-0-0-c2050bdfdfecbb35fe3ff1961713ca64&bcevod_channel=searchbox_feed&pd=1&cd=0&pt=3&logid=2767855634&vid=5349982994516799314&abtest=104960_1-104959_2&klogid=2767855634"></video>
			<view class="qa">
				<view class="qw">
					<image style="width: 45rpx;height: 45rpx;margin-top: 20rpx;"
						src="https://img1.baidu.com/it/u=592570905,1313515675&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1668618000&t=02b6f134233fcc0e616ce7711e1f1115"
						mode=""></image>
					<view class="qq">
						琦琦妙妙屋| <span style="color: rebeccapurple;margin-left: 10rpx;">关注</span>
					</view>
				</view>
				<view class="tubiao">
					<icon type="waiting" style="margin-right: 10rpx;"></icon>
					<icon type="success" style="margin-right: 10rpx;"></icon>
					<icon type="search"></icon>
				</view>

			</view>
		</view>
		<view class="niu">
			<navigator url="">
				<view class="sha">
					<navigator url="../../videoinfo/new_file">
						6吨公牛被杀，结局令人遗憾
					</navigator>
				</view>
			</navigator>
			<video style="width: 100%;height: 400rpx;"
				src="https://vd3.bdstatic.com/mda-nkd1f6us30rz2h1n/sc/cae_h264/1668392698384936635/mda-nkd1f6us30rz2h1n.mp4?v_from_s=hkapp-haokan-hbe&auth_key=1668492967-0-0-c2050bdfdfecbb35fe3ff1961713ca64&bcevod_channel=searchbox_feed&pd=1&cd=0&pt=3&logid=2767855634&vid=5349982994516799314&abtest=104960_1-104959_2&klogid=2767855634"></video>
			<view class="qa">
				<view class="qw">
					<image style="width: 45rpx;height: 45rpx;margin-top: 20rpx;"
						src="https://img1.baidu.com/it/u=592570905,1313515675&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1668618000&t=02b6f134233fcc0e616ce7711e1f1115"
						mode=""></image>
					<view class="qq">
						琦琦妙妙屋| <span style="color: rebeccapurple;margin-left: 10rpx;">关注</span>
					</view>
				</view>
				<view class="tubiao">
					<icon type="waiting" style="margin-right: 10rpx;"></icon>
					<icon type="success" style="margin-right: 10rpx;"></icon>
					<icon type="search"></icon>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
</script>

<style>
	.tubiao {
		margin-top: 15rpx;
		display: inline-block;
		margin-left: 150rpx;
	}

	.qa {
		display: flex;
	}

	.qw {
		display: flex;

	}

	.qq {
		margin-left: 20rpx;
		margin-top: 20rpx;
	}

	.sha {
		font-size: 36rpx;
		margin-bottom: 30rpx;
	}

	.niu {
		display: flex;
		flex-wrap: wrap;
		margin: 30rpx;
		/* justify-content:center */
	}

	.items {
		margin: 30rpx;
		border-bottom: #000000 1rpx solid;
	}

	.item view {
		display: inline-block;
		margin-left: 30rpx;
		color: #000000;
	}
</style>
